<template>
  <DialogTable
    title="选择物料"
    v-model:show="open"
    v-model="selectData"
    :api="requestApi"
    :multiple="true"
    rowKey="code"
    labelKey="name"
    :columns="columns"
    :search="searchParams"
    :showPagination="true"
    @change="selectProd"
  ></DialogTable>
</template>

<script setup name="MatDialog">
// 物料选择弹窗
import { matFeignSelect } from "@/api/technology/formulation";
import { ref, reactive, toRefs } from "vue";
const open = defineModel("show");
const selectData = defineModel();
const requestApi = ref(matFeignSelect);
const data = reactive({
  form: {},
  columns: [
    {
      label: "物料编号",
      align: "center",
      prop: "code",
    },
    {
      label: "物料名称",
      align: "center",
      prop: "name",
    },
    {
      label: "物料分类",
      align: "center",
      prop: "typeName",
    },
    {
      label: "工厂",
      align: "center",
      prop: "factoryName",
    },
    {
      label: "单位",
      align: "center",
      prop: "measureUnit",
    },
    {
      label: "型号",
      align: "center",
      prop: "model",
    },
    {
      label: "规格",
      align: "center",
      prop: "packages",
    },
    {
      label: "品牌",
      align: "center",
      prop: "brand",
    },
  ],
  searchParams: [
    {
      prop: "factory",
      type: "searchTool",
      showFactory: true,
    },
    {
      label: "物料编号",
      prop: "code",
    },
    {
      label: "物料名称",
      prop: "name",
    },
  ],
});
const dataCallback = (res) => {
  return res.data || [];
};
const { columns, searchParams } = toRefs(data);

const emit = defineEmits(["change"]);

function selectProd() {
  emit("change", selectData.value);
}
</script>

<style lang="scss" scoped></style>
